﻿@namespace MudBlazor.UnitTests.TestComponents

<MudDropContainer T="DropItem" Items="_items" ItemsSelector="@((item,dropzone) => item.Selector == dropzone)" ItemPicked="OnDragStart" ItemDropped="ItemUpdated" Class="d-flex flex-wrap flex-grow-1" >
    <ChildContent>
        @for (int i = 1; i < 5; i++)
        {
            var dropzone = i.ToString();
            <MudPaper Class="ma-4 flex-grow-1 ">
                <MudList Clickable="true" Class="d-flex flex-column mud-height-full">
                    <MudListSubheader>Drop Zone @dropzone</MudListSubheader>
                    <MudDropZone T="DropItem" Identifier="@dropzone" Class="@($"flex-grow-1 dropzone-{dropzone}")" AllowReorder="true" />
                </MudList>
            </MudPaper>
        }
    </ChildContent>
    <ItemRenderer>
        <MudListItem Text="@context.Name" />
    </ItemRenderer>
</MudDropContainer>

<MudText>@Message</MudText>

@code {
    private string Message;

    private void ItemUpdated(MudItemDropInfo<DropItem> dropItem)
    {
        dropItem.Item.Selector = dropItem.DropzoneIdentifier;
        IndexHistory.Add(dropItem.IndexInZone);
        Message = string.Empty;
    }

    public List<int> IndexHistory { get; set; } = new();

    private List<DropItem> _items = new()
    {
        new DropItem(){ Name = "Item 1", Selector = "1" },
        new DropItem(){ Name = "Item 2", Selector = "1" },
        new DropItem(){ Name = "Item 3", Selector = "1" },
        new DropItem(){ Name = "Item 4", Selector = "1" },
        new DropItem(){ Name = "Item 5", Selector = "2" },
        new DropItem(){ Name = "Item 6", Selector = "2" },
    };

    public class DropItem
    {
        public string Name { get; init; }
        public string Selector { get; set; }
    }

    private void OnDragStart(MudDragAndDropItemTransaction<DropItem> TransactionItem)
    {
        Message = $"Draging Started for [{TransactionItem.Item.Name}]";
        StateHasChanged();
    }
}